<template>
	<view>
		<view class="cont">
			<textarea 
				class="textarea" 
				v-model="msg" 
				@confirm="postRefund"
				fixed adjust-position disable-default-padding placeholder="请填写退款内容"></textarea>
			<v-button :height="80" @onclick="postRefund">
				<text style="font-size: 30rpx;">提交申请</text>
			</v-button>
		</view>
	</view>
</template>

<script>
	import UserApi from "@/api/user.js";
	import { toast, alert } from "@/utils/alert.js";
	import vButton from "@/components/button/button.vue";
	
	export default {
		components: {
			vButton
		},
		data() {
			return {
				msg: ""
			}
		},
		onLoad(e) {
			console.log(e)
			this.id = e.id;
		},
		methods: {
			postRefund() {
				if(this.msg.length > 0) {
					alert("您是否确定要退款？","提示", true)
						.then(()=> this.onPostRefund())
				} else {
					toast("请填写退款原因")
				}
			},
			async onPostRefund() {
				const res = await UserApi.PostRefund({
					id: this.id,
					msg: this.msg
				})
				this.visible = false;
				toast("提交成功", "success");
				uni.navigateBack()
			}
		}
	}
</script>

<style lang="scss">
.cont{
	padding: 0 30rpx;
	.textarea{
		width: 100%;
		height: 400rpx;
		font-size: 28rpx;
		margin: 30rpx 0;
		margin-bottom: 50rpx;
		padding: 20rpx;
		background-color: #eee;
		box-sizing: border-box;
	}
	}
</style>
